<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="generator" content="Asciidoctor 2.0.23">
<meta name="description" content="Learn about the GUIX widget styles.">
<title>Appendix C - GUIX Widget Styles</title>
<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Open+Sans:300,300italic,400,400italic,600,600italic%7CNoto+Serif:400,400italic,700,700italic%7CDroid+Sans+Mono:400,700">
<style>
/*! Asciidoctor default stylesheet | MIT License | https://asciidoctor.org */
/* Uncomment the following line when using as a custom stylesheet */
/* @import "https://fonts.googleapis.com/css?family=Open+Sans:300,300italic,400,400italic,600,600italic%7CNoto+Serif:400,400italic,700,700italic%7CDroid+Sans+Mono:400,700"; */
html{font-family:sans-serif;-webkit-text-size-adjust:100%}
a{background:none}
a:focus{outline:thin dotted}
a:active,a:hover{outline:0}
h1{font-size:2em;margin:.67em 0}
b,strong{font-weight:bold}
abbr{font-size:.9em}
abbr[title]{cursor:help;border-bottom:1px dotted #dddddf;text-decoration:none}
dfn{font-style:italic}
hr{height:0}
mark{background:#ff0;color:#000}
code,kbd,pre,samp{font-family:monospace;font-size:1em}
pre{white-space:pre-wrap}
q{quotes:"\201C" "\201D" "\2018" "\2019"}
small{font-size:80%}
sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}
sup{top:-.5em}
sub{bottom:-.25em}
img{border:0}
svg:not(:root){overflow:hidden}
figure{margin:0}
audio,video{display:inline-block}
audio:not([controls]){display:none;height:0}
fieldset{border:1px solid silver;margin:0 2px;padding:.35em .625em .75em}
legend{border:0;padding:0}
button,input,select,textarea{font-family:inherit;font-size:100%;margin:0}
button,input{line-height:normal}
button,select{text-transform:none}
button,html input[type=button],input[type=reset],input[type=submit]{-webkit-appearance:button;cursor:pointer}
button[disabled],html input[disabled]{cursor:default}
input[type=checkbox],input[type=radio]{padding:0}
button::-moz-focus-inner,input::-moz-focus-inner{border:0;padding:0}
textarea{overflow:auto;vertical-align:top}
table{border-collapse:collapse;border-spacing:0}
*,::before,::after{box-sizing:border-box}
html,body{font-size:100%}
body{background:#fff;color:rgba(0,0,0,.8);padding:0;margin:0;font-family:"Noto Serif","DejaVu Serif",serif;line-height:1;position:relative;cursor:auto;-moz-tab-size:4;-o-tab-size:4;tab-size:4;word-wrap:anywhere;-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased}
a:hover{cursor:pointer}
img,object,embed{max-width:100%;height:auto}
object,embed{height:100%}
img{-ms-interpolation-mode:bicubic}
.left{float:left!important}
.right{float:right!important}
.text-left{text-align:left!important}
.text-right{text-align:right!important}
.text-center{text-align:center!important}
.text-justify{text-align:justify!important}
.hide{display:none}
img,object,svg{display:inline-block;vertical-align:middle}
textarea{height:auto;min-height:50px}
select{width:100%}
.subheader,.admonitionblock td.content>.title,.audioblock>.title,.exampleblock>.title,.imageblock>.title,.listingblock>.title,.literalblock>.title,.stemblock>.title,.openblock>.title,.paragraph>.title,.quoteblock>.title,table.tableblock>.title,.verseblock>.title,.videoblock>.title,.dlist>.title,.olist>.title,.ulist>.title,.qlist>.title,.hdlist>.title{line-height:1.45;color:#7a2518;font-weight:400;margin-top:0;margin-bottom:.25em}
div,dl,dt,dd,ul,ol,li,h1,h2,h3,#toctitle,.sidebarblock>.content>.title,h4,h5,h6,pre,form,p,blockquote,th,td{margin:0;padding:0}
a{color:#2156a5;text-decoration:underline;line-height:inherit}
a:hover,a:focus{color:#1d4b8f}
a img{border:0}
p{line-height:1.6;margin-bottom:1.25em;text-rendering:optimizeLegibility}
p aside{font-size:.875em;line-height:1.35;font-style:italic}
h1,h2,h3,#toctitle,.sidebarblock>.content>.title,h4,h5,h6{font-family:"Open Sans","DejaVu Sans",sans-serif;font-weight:300;font-style:normal;color:#ba3925;text-rendering:optimizeLegibility;margin-top:1em;margin-bottom:.5em;line-height:1.0125em}
h1 small,h2 small,h3 small,#toctitle small,.sidebarblock>.content>.title small,h4 small,h5 small,h6 small{font-size:60%;color:#e99b8f;line-height:0}
h1{font-size:2.125em}
h2{font-size:1.6875em}
h3,#toctitle,.sidebarblock>.content>.title{font-size:1.375em}
h4,h5{font-size:1.125em}
h6{font-size:1em}
hr{border:solid #dddddf;border-width:1px 0 0;clear:both;margin:1.25em 0 1.1875em}
em,i{font-style:italic;line-height:inherit}
strong,b{font-weight:bold;line-height:inherit}
small{font-size:60%;line-height:inherit}
code{font-family:"Droid Sans Mono","DejaVu Sans Mono",monospace;font-weight:400;color:rgba(0,0,0,.9)}
ul,ol,dl{line-height:1.6;margin-bottom:1.25em;list-style-position:outside;font-family:inherit}
ul,ol{margin-left:1.5em}
ul li ul,ul li ol{margin-left:1.25em;margin-bottom:0}
ul.circle{list-style-type:circle}
ul.disc{list-style-type:disc}
ul.square{list-style-type:square}
ul.circle ul:not([class]),ul.disc ul:not([class]),ul.square ul:not([class]){list-style:inherit}
ol li ul,ol li ol{margin-left:1.25em;margin-bottom:0}
dl dt{margin-bottom:.3125em;font-weight:bold}
dl dd{margin-bottom:1.25em}
blockquote{margin:0 0 1.25em;padding:.5625em 1.25em 0 1.1875em;border-left:1px solid #ddd}
blockquote,blockquote p{line-height:1.6;color:rgba(0,0,0,.85)}
@media screen and (min-width:768px){h1,h2,h3,#toctitle,.sidebarblock>.content>.title,h4,h5,h6{line-height:1.2}
h1{font-size:2.75em}
h2{font-size:2.3125em}
h3,#toctitle,.sidebarblock>.content>.title{font-size:1.6875em}
h4{font-size:1.4375em}}
table{background:#fff;margin-bottom:1.25em;border:1px solid #dedede;word-wrap:normal}
table thead,table tfoot{background:#f7f8f7}
table thead tr th,table thead tr td,table tfoot tr th,table tfoot tr td{padding:.5em .625em .625em;font-size:inherit;color:rgba(0,0,0,.8);text-align:left}
table tr th,table tr td{padding:.5625em .625em;font-size:inherit;color:rgba(0,0,0,.8)}
table tr.even,table tr.alt{background:#f8f8f7}
table thead tr th,table tfoot tr th,table tbody tr td,table tr td,table tfoot tr td{line-height:1.6}
h1,h2,h3,#toctitle,.sidebarblock>.content>.title,h4,h5,h6{line-height:1.2;word-spacing:-.05em}
h1 strong,h2 strong,h3 strong,#toctitle strong,.sidebarblock>.content>.title strong,h4 strong,h5 strong,h6 strong{font-weight:400}
.center{margin-left:auto;margin-right:auto}
.stretch{width:100%}
.clearfix::before,.clearfix::after,.float-group::before,.float-group::after{content:" ";display:table}
.clearfix::after,.float-group::after{clear:both}
:not(pre).nobreak{word-wrap:normal}
:not(pre).nowrap{white-space:nowrap}
:not(pre).pre-wrap{white-space:pre-wrap}
:not(pre):not([class^=L])>code{font-size:.9375em;font-style:normal!important;letter-spacing:0;padding:.1em .5ex;word-spacing:-.15em;background:#f7f7f8;border-radius:4px;line-height:1.45;text-rendering:optimizeSpeed}
pre{color:rgba(0,0,0,.9);font-family:"Droid Sans Mono","DejaVu Sans Mono",monospace;line-height:1.45;text-rendering:optimizeSpeed}
pre code,pre pre{color:inherit;font-size:inherit;line-height:inherit}
pre>code{display:block}
pre.nowrap,pre.nowrap pre{white-space:pre;word-wrap:normal}
em em{font-style:normal}
strong strong{font-weight:400}
.keyseq{color:rgba(51,51,51,.8)}
kbd{font-family:"Droid Sans Mono","DejaVu Sans Mono",monospace;display:inline-block;color:rgba(0,0,0,.8);font-size:.65em;line-height:1.45;background:#f7f7f7;border:1px solid #ccc;border-radius:3px;box-shadow:0 1px 0 rgba(0,0,0,.2),inset 0 0 0 .1em #fff;margin:0 .15em;padding:.2em .5em;vertical-align:middle;position:relative;top:-.1em;white-space:nowrap}
.keyseq kbd:first-child{margin-left:0}
.keyseq kbd:last-child{margin-right:0}
.menuseq,.menuref{color:#000}
.menuseq b:not(.caret),.menuref{font-weight:inherit}
.menuseq{word-spacing:-.02em}
.menuseq b.caret{font-size:1.25em;line-height:.8}
.menuseq i.caret{font-weight:bold;text-align:center;width:.45em}
b.button::before,b.button::after{position:relative;top:-1px;font-weight:400}
b.button::before{content:"[";padding:0 3px 0 2px}
b.button::after{content:"]";padding:0 2px 0 3px}
p a>code:hover{color:rgba(0,0,0,.9)}
#header,#content,#footnotes,#footer{width:100%;margin:0 auto;max-width:62.5em;*zoom:1;position:relative;padding-left:.9375em;padding-right:.9375em}
#header::before,#header::after,#content::before,#content::after,#footnotes::before,#footnotes::after,#footer::before,#footer::after{content:" ";display:table}
#header::after,#content::after,#footnotes::after,#footer::after{clear:both}
#content{margin-top:1.25em}
#content::before{content:none}
#header>h1:first-child{color:rgba(0,0,0,.85);margin-top:2.25rem;margin-bottom:0}
#header>h1:first-child+#toc{margin-top:8px;border-top:1px solid #dddddf}
#header>h1:only-child{border-bottom:1px solid #dddddf;padding-bottom:8px}
#header .details{border-bottom:1px solid #dddddf;line-height:1.45;padding-top:.25em;padding-bottom:.25em;padding-left:.25em;color:rgba(0,0,0,.6);display:flex;flex-flow:row wrap}
#header .details span:first-child{margin-left:-.125em}
#header .details span.email a{color:rgba(0,0,0,.85)}
#header .details br{display:none}
#header .details br+span::before{content:"\00a0\2013\00a0"}
#header .details br+span.author::before{content:"\00a0\22c5\00a0";color:rgba(0,0,0,.85)}
#header .details br+span#revremark::before{content:"\00a0|\00a0"}
#header #revnumber{text-transform:capitalize}
#header #revnumber::after{content:"\00a0"}
#content>h1:first-child:not([class]){color:rgba(0,0,0,.85);border-bottom:1px solid #dddddf;padding-bottom:8px;margin-top:0;padding-top:1rem;margin-bottom:1.25rem}
#toc{border-bottom:1px solid #e7e7e9;padding-bottom:.5em}
#toc>ul{margin-left:.125em}
#toc ul.sectlevel0>li>a{font-style:italic}
#toc ul.sectlevel0 ul.sectlevel1{margin:.5em 0}
#toc ul{font-family:"Open Sans","DejaVu Sans",sans-serif;list-style-type:none}
#toc li{line-height:1.3334;margin-top:.3334em}
#toc a{text-decoration:none}
#toc a:active{text-decoration:underline}
#toctitle{color:#7a2518;font-size:1.2em}
@media screen and (min-width:768px){#toctitle{font-size:1.375em}
body.toc2{padding-left:15em;padding-right:0}
body.toc2 #header>h1:nth-last-child(2){border-bottom:1px solid #dddddf;padding-bottom:8px}
#toc.toc2{margin-top:0!important;background:#f8f8f7;position:fixed;width:15em;left:0;top:0;border-right:1px solid #e7e7e9;border-top-width:0!important;border-bottom-width:0!important;z-index:1000;padding:1.25em 1em;height:100%;overflow:auto}
#toc.toc2 #toctitle{margin-top:0;margin-bottom:.8rem;font-size:1.2em}
#toc.toc2>ul{font-size:.9em;margin-bottom:0}
#toc.toc2 ul ul{margin-left:0;padding-left:1em}
#toc.toc2 ul.sectlevel0 ul.sectlevel1{padding-left:0;margin-top:.5em;margin-bottom:.5em}
body.toc2.toc-right{padding-left:0;padding-right:15em}
body.toc2.toc-right #toc.toc2{border-right-width:0;border-left:1px solid #e7e7e9;left:auto;right:0}}
@media screen and (min-width:1280px){body.toc2{padding-left:20em;padding-right:0}
#toc.toc2{width:20em}
#toc.toc2 #toctitle{font-size:1.375em}
#toc.toc2>ul{font-size:.95em}
#toc.toc2 ul ul{padding-left:1.25em}
body.toc2.toc-right{padding-left:0;padding-right:20em}}
#content #toc{border:1px solid #e0e0dc;margin-bottom:1.25em;padding:1.25em;background:#f8f8f7;border-radius:4px}
#content #toc>:first-child{margin-top:0}
#content #toc>:last-child{margin-bottom:0}
#footer{max-width:none;background:rgba(0,0,0,.8);padding:1.25em}
#footer-text{color:hsla(0,0%,100%,.8);line-height:1.44}
#content{margin-bottom:.625em}
.sect1{padding-bottom:.625em}
@media screen and (min-width:768px){#content{margin-bottom:1.25em}
.sect1{padding-bottom:1.25em}}
.sect1:last-child{padding-bottom:0}
.sect1+.sect1{border-top:1px solid #e7e7e9}
#content h1>a.anchor,h2>a.anchor,h3>a.anchor,#toctitle>a.anchor,.sidebarblock>.content>.title>a.anchor,h4>a.anchor,h5>a.anchor,h6>a.anchor{position:absolute;z-index:1001;width:1.5ex;margin-left:-1.5ex;display:block;text-decoration:none!important;visibility:hidden;text-align:center;font-weight:400}
#content h1>a.anchor::before,h2>a.anchor::before,h3>a.anchor::before,#toctitle>a.anchor::before,.sidebarblock>.content>.title>a.anchor::before,h4>a.anchor::before,h5>a.anchor::before,h6>a.anchor::before{content:"\00A7";font-size:.85em;display:block;padding-top:.1em}
#content h1:hover>a.anchor,#content h1>a.anchor:hover,h2:hover>a.anchor,h2>a.anchor:hover,h3:hover>a.anchor,#toctitle:hover>a.anchor,.sidebarblock>.content>.title:hover>a.anchor,h3>a.anchor:hover,#toctitle>a.anchor:hover,.sidebarblock>.content>.title>a.anchor:hover,h4:hover>a.anchor,h4>a.anchor:hover,h5:hover>a.anchor,h5>a.anchor:hover,h6:hover>a.anchor,h6>a.anchor:hover{visibility:visible}
#content h1>a.link,h2>a.link,h3>a.link,#toctitle>a.link,.sidebarblock>.content>.title>a.link,h4>a.link,h5>a.link,h6>a.link{color:#ba3925;text-decoration:none}
#content h1>a.link:hover,h2>a.link:hover,h3>a.link:hover,#toctitle>a.link:hover,.sidebarblock>.content>.title>a.link:hover,h4>a.link:hover,h5>a.link:hover,h6>a.link:hover{color:#a53221}
details,.audioblock,.imageblock,.literalblock,.listingblock,.stemblock,.videoblock{margin-bottom:1.25em}
details{margin-left:1.25rem}
details>summary{cursor:pointer;display:block;position:relative;line-height:1.6;margin-bottom:.625rem;outline:none;-webkit-tap-highlight-color:transparent}
details>summary::-webkit-details-marker{display:none}
details>summary::before{content:"";border:solid transparent;border-left:solid;border-width:.3em 0 .3em .5em;position:absolute;top:.5em;left:-1.25rem;transform:translateX(15%)}
details[open]>summary::before{border:solid transparent;border-top:solid;border-width:.5em .3em 0;transform:translateY(15%)}
details>summary::after{content:"";width:1.25rem;height:1em;position:absolute;top:.3em;left:-1.25rem}
.admonitionblock td.content>.title,.audioblock>.title,.exampleblock>.title,.imageblock>.title,.listingblock>.title,.literalblock>.title,.stemblock>.title,.openblock>.title,.paragraph>.title,.quoteblock>.title,table.tableblock>.title,.verseblock>.title,.videoblock>.title,.dlist>.title,.olist>.title,.ulist>.title,.qlist>.title,.hdlist>.title{text-rendering:optimizeLegibility;text-align:left;font-family:"Noto Serif","DejaVu Serif",serif;font-size:1rem;font-style:italic}
table.tableblock.fit-content>caption.title{white-space:nowrap;width:0}
.paragraph.lead>p,#preamble>.sectionbody>[class=paragraph]:first-of-type p{font-size:1.21875em;line-height:1.6;color:rgba(0,0,0,.85)}
.admonitionblock>table{border-collapse:separate;border:0;background:none;width:100%}
.admonitionblock>table td.icon{text-align:center;width:80px}
.admonitionblock>table td.icon img{max-width:none}
.admonitionblock>table td.icon .title{font-weight:bold;font-family:"Open Sans","DejaVu Sans",sans-serif;text-transform:uppercase}
.admonitionblock>table td.content{padding-left:1.125em;padding-right:1.25em;border-left:1px solid #dddddf;color:rgba(0,0,0,.6);word-wrap:anywhere}
.admonitionblock>table td.content>:last-child>:last-child{margin-bottom:0}
.exampleblock>.content{border:1px solid #e6e6e6;margin-bottom:1.25em;padding:1.25em;background:#fff;border-radius:4px}
.sidebarblock{border:1px solid #dbdbd6;margin-bottom:1.25em;padding:1.25em;background:#f3f3f2;border-radius:4px}
.sidebarblock>.content>.title{color:#7a2518;margin-top:0;text-align:center}
.exampleblock>.content>:first-child,.sidebarblock>.content>:first-child{margin-top:0}
.exampleblock>.content>:last-child,.exampleblock>.content>:last-child>:last-child,.exampleblock>.content .olist>ol>li:last-child>:last-child,.exampleblock>.content .ulist>ul>li:last-child>:last-child,.exampleblock>.content .qlist>ol>li:last-child>:last-child,.sidebarblock>.content>:last-child,.sidebarblock>.content>:last-child>:last-child,.sidebarblock>.content .olist>ol>li:last-child>:last-child,.sidebarblock>.content .ulist>ul>li:last-child>:last-child,.sidebarblock>.content .qlist>ol>li:last-child>:last-child{margin-bottom:0}
.literalblock pre,.listingblock>.content>pre{border-radius:4px;overflow-x:auto;padding:1em;font-size:.8125em}
@media screen and (min-width:768px){.literalblock pre,.listingblock>.content>pre{font-size:.90625em}}
@media screen and (min-width:1280px){.literalblock pre,.listingblock>.content>pre{font-size:1em}}
.literalblock pre,.listingblock>.content>pre:not(.highlight),.listingblock>.content>pre[class=highlight],.listingblock>.content>pre[class^="highlight "]{background:#f7f7f8}
.literalblock.output pre{color:#f7f7f8;background:rgba(0,0,0,.9)}
.listingblock>.content{position:relative}
.listingblock code[data-lang]::before{display:none;content:attr(data-lang);position:absolute;font-size:.75em;top:.425rem;right:.5rem;line-height:1;text-transform:uppercase;color:inherit;opacity:.5}
.listingblock:hover code[data-lang]::before{display:block}
.listingblock.terminal pre .command::before{content:attr(data-prompt);padding-right:.5em;color:inherit;opacity:.5}
.listingblock.terminal pre .command:not([data-prompt])::before{content:"$"}
.listingblock pre.highlightjs{padding:0}
.listingblock pre.highlightjs>code{padding:1em;border-radius:4px}
.listingblock pre.prettyprint{border-width:0}
.prettyprint{background:#f7f7f8}
pre.prettyprint .linenums{line-height:1.45;margin-left:2em}
pre.prettyprint li{background:none;list-style-type:inherit;padding-left:0}
pre.prettyprint li code[data-lang]::before{opacity:1}
pre.prettyprint li:not(:first-child) code[data-lang]::before{display:none}
table.linenotable{border-collapse:separate;border:0;margin-bottom:0;background:none}
table.linenotable td[class]{color:inherit;vertical-align:top;padding:0;line-height:inherit;white-space:normal}
table.linenotable td.code{padding-left:.75em}
table.linenotable td.linenos,pre.pygments .linenos{border-right:1px solid;opacity:.35;padding-right:.5em;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}
pre.pygments span.linenos{display:inline-block;margin-right:.75em}
.quoteblock{margin:0 1em 1.25em 1.5em;display:table}
.quoteblock:not(.excerpt)>.title{margin-left:-1.5em;margin-bottom:.75em}
.quoteblock blockquote,.quoteblock p{color:rgba(0,0,0,.85);font-size:1.15rem;line-height:1.75;word-spacing:.1em;letter-spacing:0;font-style:italic;text-align:justify}
.quoteblock blockquote{margin:0;padding:0;border:0}
.quoteblock blockquote::before{content:"\201c";float:left;font-size:2.75em;font-weight:bold;line-height:.6em;margin-left:-.6em;color:#7a2518;text-shadow:0 1px 2px rgba(0,0,0,.1)}
.quoteblock blockquote>.paragraph:last-child p{margin-bottom:0}
.quoteblock .attribution{margin-top:.75em;margin-right:.5ex;text-align:right}
.verseblock{margin:0 1em 1.25em}
.verseblock pre{font-family:"Open Sans","DejaVu Sans",sans-serif;font-size:1.15rem;color:rgba(0,0,0,.85);font-weight:300;text-rendering:optimizeLegibility}
.verseblock pre strong{font-weight:400}
.verseblock .attribution{margin-top:1.25rem;margin-left:.5ex}
.quoteblock .attribution,.verseblock .attribution{font-size:.9375em;line-height:1.45;font-style:italic}
.quoteblock .attribution br,.verseblock .attribution br{display:none}
.quoteblock .attribution cite,.verseblock .attribution cite{display:block;letter-spacing:-.025em;color:rgba(0,0,0,.6)}
.quoteblock.abstract blockquote::before,.quoteblock.excerpt blockquote::before,.quoteblock .quoteblock blockquote::before{display:none}
.quoteblock.abstract blockquote,.quoteblock.abstract p,.quoteblock.excerpt blockquote,.quoteblock.excerpt p,.quoteblock .quoteblock blockquote,.quoteblock .quoteblock p{line-height:1.6;word-spacing:0}
.quoteblock.abstract{margin:0 1em 1.25em;display:block}
.quoteblock.abstract>.title{margin:0 0 .375em;font-size:1.15em;text-align:center}
.quoteblock.excerpt>blockquote,.quoteblock .quoteblock{padding:0 0 .25em 1em;border-left:.25em solid #dddddf}
.quoteblock.excerpt,.quoteblock .quoteblock{margin-left:0}
.quoteblock.excerpt blockquote,.quoteblock.excerpt p,.quoteblock .quoteblock blockquote,.quoteblock .quoteblock p{color:inherit;font-size:1.0625rem}
.quoteblock.excerpt .attribution,.quoteblock .quoteblock .attribution{color:inherit;font-size:.85rem;text-align:left;margin-right:0}
p.tableblock:last-child{margin-bottom:0}
td.tableblock>.content{margin-bottom:1.25em;word-wrap:anywhere}
td.tableblock>.content>:last-child{margin-bottom:-1.25em}
table.tableblock,th.tableblock,td.tableblock{border:0 solid #dedede}
table.grid-all>*>tr>*{border-width:1px}
table.grid-cols>*>tr>*{border-width:0 1px}
table.grid-rows>*>tr>*{border-width:1px 0}
table.frame-all{border-width:1px}
table.frame-ends{border-width:1px 0}
table.frame-sides{border-width:0 1px}
table.frame-none>colgroup+*>:first-child>*,table.frame-sides>colgroup+*>:first-child>*{border-top-width:0}
table.frame-none>:last-child>:last-child>*,table.frame-sides>:last-child>:last-child>*{border-bottom-width:0}
table.frame-none>*>tr>:first-child,table.frame-ends>*>tr>:first-child{border-left-width:0}
table.frame-none>*>tr>:last-child,table.frame-ends>*>tr>:last-child{border-right-width:0}
table.stripes-all>*>tr,table.stripes-odd>*>tr:nth-of-type(odd),table.stripes-even>*>tr:nth-of-type(even),table.stripes-hover>*>tr:hover{background:#f8f8f7}
th.halign-left,td.halign-left{text-align:left}
th.halign-right,td.halign-right{text-align:right}
th.halign-center,td.halign-center{text-align:center}
th.valign-top,td.valign-top{vertical-align:top}
th.valign-bottom,td.valign-bottom{vertical-align:bottom}
th.valign-middle,td.valign-middle{vertical-align:middle}
table thead th,table tfoot th{font-weight:bold}
tbody tr th{background:#f7f8f7}
tbody tr th,tbody tr th p,tfoot tr th,tfoot tr th p{color:rgba(0,0,0,.8);font-weight:bold}
p.tableblock>code:only-child{background:none;padding:0}
p.tableblock{font-size:1em}
ol{margin-left:1.75em}
ul li ol{margin-left:1.5em}
dl dd{margin-left:1.125em}
dl dd:last-child,dl dd:last-child>:last-child{margin-bottom:0}
li p,ul dd,ol dd,.olist .olist,.ulist .ulist,.ulist .olist,.olist .ulist{margin-bottom:.625em}
ul.checklist,ul.none,ol.none,ul.no-bullet,ol.no-bullet,ol.unnumbered,ul.unstyled,ol.unstyled{list-style-type:none}
ul.no-bullet,ol.no-bullet,ol.unnumbered{margin-left:.625em}
ul.unstyled,ol.unstyled{margin-left:0}
li>p:empty:only-child::before{content:"";display:inline-block}
ul.checklist>li>p:first-child{margin-left:-1em}
ul.checklist>li>p:first-child>.fa-square-o:first-child,ul.checklist>li>p:first-child>.fa-check-square-o:first-child{width:1.25em;font-size:.8em;position:relative;bottom:.125em}
ul.checklist>li>p:first-child>input[type=checkbox]:first-child{margin-right:.25em}
ul.inline{display:flex;flex-flow:row wrap;list-style:none;margin:0 0 .625em -1.25em}
ul.inline>li{margin-left:1.25em}
.unstyled dl dt{font-weight:400;font-style:normal}
ol.arabic{list-style-type:decimal}
ol.decimal{list-style-type:decimal-leading-zero}
ol.loweralpha{list-style-type:lower-alpha}
ol.upperalpha{list-style-type:upper-alpha}
ol.lowerroman{list-style-type:lower-roman}
ol.upperroman{list-style-type:upper-roman}
ol.lowergreek{list-style-type:lower-greek}
.hdlist>table,.colist>table{border:0;background:none}
.hdlist>table>tbody>tr,.colist>table>tbody>tr{background:none}
td.hdlist1,td.hdlist2{vertical-align:top;padding:0 .625em}
td.hdlist1{font-weight:bold;padding-bottom:1.25em}
td.hdlist2{word-wrap:anywhere}
.literalblock+.colist,.listingblock+.colist{margin-top:-.5em}
.colist td:not([class]):first-child{padding:.4em .75em 0;line-height:1;vertical-align:top}
.colist td:not([class]):first-child img{max-width:none}
.colist td:not([class]):last-child{padding:.25em 0}
.thumb,.th{line-height:0;display:inline-block;border:4px solid #fff;box-shadow:0 0 0 1px #ddd}
.imageblock.left{margin:.25em .625em 1.25em 0}
.imageblock.right{margin:.25em 0 1.25em .625em}
.imageblock>.title{margin-bottom:0}
.imageblock.thumb,.imageblock.th{border-width:6px}
.imageblock.thumb>.title,.imageblock.th>.title{padding:0 .125em}
.image.left,.image.right{margin-top:.25em;margin-bottom:.25em;display:inline-block;line-height:0}
.image.left{margin-right:.625em}
.image.right{margin-left:.625em}
a.image{text-decoration:none;display:inline-block}
a.image object{pointer-events:none}
sup.footnote,sup.footnoteref{font-size:.875em;position:static;vertical-align:super}
sup.footnote a,sup.footnoteref a{text-decoration:none}
sup.footnote a:active,sup.footnoteref a:active,#footnotes .footnote a:first-of-type:active{text-decoration:underline}
#footnotes{padding-top:.75em;padding-bottom:.75em;margin-bottom:.625em}
#footnotes hr{width:20%;min-width:6.25em;margin:-.25em 0 .75em;border-width:1px 0 0}
#footnotes .footnote{padding:0 .375em 0 .225em;line-height:1.3334;font-size:.875em;margin-left:1.2em;margin-bottom:.2em}
#footnotes .footnote a:first-of-type{font-weight:bold;text-decoration:none;margin-left:-1.05em}
#footnotes .footnote:last-of-type{margin-bottom:0}
#content #footnotes{margin-top:-.625em;margin-bottom:0;padding:.75em 0}
div.unbreakable{page-break-inside:avoid}
.big{font-size:larger}
.small{font-size:smaller}
.underline{text-decoration:underline}
.overline{text-decoration:overline}
.line-through{text-decoration:line-through}
.aqua{color:#00bfbf}
.aqua-background{background:#00fafa}
.black{color:#000}
.black-background{background:#000}
.blue{color:#0000bf}
.blue-background{background:#0000fa}
.fuchsia{color:#bf00bf}
.fuchsia-background{background:#fa00fa}
.gray{color:#606060}
.gray-background{background:#7d7d7d}
.green{color:#006000}
.green-background{background:#007d00}
.lime{color:#00bf00}
.lime-background{background:#00fa00}
.maroon{color:#600000}
.maroon-background{background:#7d0000}
.navy{color:#000060}
.navy-background{background:#00007d}
.olive{color:#606000}
.olive-background{background:#7d7d00}
.purple{color:#600060}
.purple-background{background:#7d007d}
.red{color:#bf0000}
.red-background{background:#fa0000}
.silver{color:#909090}
.silver-background{background:#bcbcbc}
.teal{color:#006060}
.teal-background{background:#007d7d}
.white{color:#bfbfbf}
.white-background{background:#fafafa}
.yellow{color:#bfbf00}
.yellow-background{background:#fafa00}
span.icon>.fa{cursor:default}
a span.icon>.fa{cursor:inherit}
.admonitionblock td.icon [class^="fa icon-"]{font-size:2.5em;text-shadow:1px 1px 2px rgba(0,0,0,.5);cursor:default}
.admonitionblock td.icon .icon-note::before{content:"\f05a";color:#19407c}
.admonitionblock td.icon .icon-tip::before{content:"\f0eb";text-shadow:1px 1px 2px rgba(155,155,0,.8);color:#111}
.admonitionblock td.icon .icon-warning::before{content:"\f071";color:#bf6900}
.admonitionblock td.icon .icon-caution::before{content:"\f06d";color:#bf3400}
.admonitionblock td.icon .icon-important::before{content:"\f06a";color:#bf0000}
.conum[data-value]{display:inline-block;color:#fff!important;background:rgba(0,0,0,.8);border-radius:50%;text-align:center;font-size:.75em;width:1.67em;height:1.67em;line-height:1.67em;font-family:"Open Sans","DejaVu Sans",sans-serif;font-style:normal;font-weight:bold}
.conum[data-value] *{color:#fff!important}
.conum[data-value]+b{display:none}
.conum[data-value]::after{content:attr(data-value)}
pre .conum[data-value]{position:relative;top:-.125em}
b.conum *{color:inherit!important}
.conum:not([data-value]):empty{display:none}
dt,th.tableblock,td.content,div.footnote{text-rendering:optimizeLegibility}
h1,h2,p,td.content,span.alt,summary{letter-spacing:-.01em}
p strong,td.content strong,div.footnote strong{letter-spacing:-.005em}
p,blockquote,dt,td.content,td.hdlist1,span.alt,summary{font-size:1.0625rem}
p{margin-bottom:1.25rem}
.sidebarblock p,.sidebarblock dt,.sidebarblock td.content,p.tableblock{font-size:1em}
.exampleblock>.content{background:#fffef7;border-color:#e0e0dc;box-shadow:0 1px 4px #e0e0dc}
.print-only{display:none!important}
@page{margin:1.25cm .75cm}
@media print{*{box-shadow:none!important;text-shadow:none!important}
html{font-size:80%}
a{color:inherit!important;text-decoration:underline!important}
a.bare,a[href^="#"],a[href^="mailto:"]{text-decoration:none!important}
a[href^="http:"]:not(.bare)::after,a[href^="https:"]:not(.bare)::after{content:"(" attr(href) ")";display:inline-block;font-size:.875em;padding-left:.25em}
abbr[title]{border-bottom:1px dotted}
abbr[title]::after{content:" (" attr(title) ")"}
pre,blockquote,tr,img,object,svg{page-break-inside:avoid}
thead{display:table-header-group}
svg{max-width:100%}
p,blockquote,dt,td.content{font-size:1em;orphans:3;widows:3}
h2,h3,#toctitle,.sidebarblock>.content>.title{page-break-after:avoid}
#header,#content,#footnotes,#footer{max-width:none}
#toc,.sidebarblock,.exampleblock>.content{background:none!important}
#toc{border-bottom:1px solid #dddddf!important;padding-bottom:0!important}
body.book #header{text-align:center}
body.book #header>h1:first-child{border:0!important;margin:2.5em 0 1em}
body.book #header .details{border:0!important;display:block;padding:0!important}
body.book #header .details span:first-child{margin-left:0!important}
body.book #header .details br{display:block}
body.book #header .details br+span::before{content:none!important}
body.book #toc{border:0!important;text-align:left!important;padding:0!important;margin:0!important}
body.book #toc,body.book #preamble,body.book h1.sect0,body.book .sect1>h2{page-break-before:always}
.listingblock code[data-lang]::before{display:block}
#footer{padding:0 .9375em}
.hide-on-print{display:none!important}
.print-only{display:block!important}
.hide-for-print{display:none!important}
.show-for-print{display:inherit!important}}
@media amzn-kf8,print{#header>h1:first-child{margin-top:1.25rem}
.sect1{padding:0!important}
.sect1+.sect1{border:0}
#footer{background:none}
#footer-text{color:rgba(0,0,0,.6);font-size:.9em}}
@media amzn-kf8{#header,#content,#footnotes,#footer{padding:0}}
</style>
</head>
<body class="article">
<div id="header">
<h1>Appendix C - GUIX Widget Styles</h1>
</div>
<div id="content">
<div class="paragraph">
<p><strong><strong><em>General Styles (Used with most widget types):</em></strong></strong></p>
</div>
<div class="paragraph">
<p><strong>GX_STYLE_BORDER_NONE</strong></p>
</div>
<div class="ulist">
<ul>
<li>
<p>Value: 0x00000000</p>
</li>
<li>
<p>Description: Use this style to draw a widget with no border.</p>
</li>
</ul>
</div>
<div class="paragraph">
<p><strong>GX_STYLE_BORDER_RAISED</strong></p>
</div>
<div class="ulist">
<ul>
<li>
<p>Value: 0x00000001</p>
</li>
<li>
<p>Description: Draw widget with a raised border.</p>
</li>
</ul>
</div>
<div class="paragraph">
<p><strong>GX_STYLE_BORDER_RECESSED</strong></p>
</div>
<div class="ulist">
<ul>
<li>
<p>Value: 0x00000002</p>
</li>
<li>
<p>Description: Draw widget with a recessed border.</p>
</li>
</ul>
</div>
<div class="paragraph">
<p><strong>GX_STYLE_BORDER_THIN</strong></p>
</div>
<div class="ulist">
<ul>
<li>
<p>Value: 0x00000004</p>
</li>
<li>
<p>Description: Draw a one-pixel width border.</p>
</li>
</ul>
</div>
<div class="paragraph">
<p><strong>GX_STYLE_BORDER_THICK</strong></p>
</div>
<div class="ulist">
<ul>
<li>
<p>Value: 0x00000008</p>
</li>
<li>
<p>Description: Draw widget with a thick border.</p>
</li>
</ul>
</div>
<div class="paragraph">
<p><strong>GX_STYLE_BORDER_MASK</strong></p>
</div>
<div class="ulist">
<ul>
<li>
<p>Value: 0x0000000f</p>
</li>
<li>
<p>Description: Mask value used to test only the style fields of the widget style member.</p>
</li>
</ul>
</div>
<div class="paragraph">
<p><strong>GX_STYLE_TRANSPARENT</strong></p>
</div>
<div class="ulist">
<ul>
<li>
<p>Value: 0x10000000</p>
</li>
<li>
<p>Description: Create a widget that is at least partially transparent. This style should be used when a widget does not draw itself fully opaque, including widgets that draw a semi-transparent pixelmap as the widget background. This style flag informs GUIX that the widget parent must be drawn to refresh the widget background area.</p>
</li>
</ul>
</div>
<div class="paragraph">
<p><strong>GX_STYLE_DRAW_SELECTED</strong></p>
</div>
<div class="ulist">
<ul>
<li>
<p>Value: 0x20000000</p>
</li>
<li>
<p>Description: Specify that the widget should be drawn using selected state colors and fonts. Different widget types use the DRAW_SELECTED style in different ways to indicate the widget is
currently selected.</p>
</li>
</ul>
</div>
<div class="paragraph">
<p><strong>GX_STYLE_ENABLED</strong></p>
</div>
<div class="ulist">
<ul>
<li>
<p>Value: 0x40000000</p>
</li>
<li>
<p>Description: Mark the widget as enabled, which allows the widget to accept user input events and generate output signals.</p>
</li>
</ul>
</div>
<div class="paragraph">
<p><strong>GX_STYLE_DYNAMICALLY_ALLOCATED</strong></p>
</div>
<div class="ulist">
<ul>
<li>
<p>Value: 0x80000000</p>
</li>
<li>
<p>Description: Indicates the widget control block memory is dynamically allocated using the gx_system_memory_allocator service when the widget is created, and the control block memory is freed if the widget is destroyed.</p>
</li>
</ul>
</div>
<div class="paragraph">
<p><strong>GX_STYLE_USE_LOCAL_ALPHA</strong></p>
</div>
<div class="ulist">
<ul>
<li>
<p>Value: 0x01000000</p>
</li>
<li>
<p>Description: Instructs GUIX drawing functions to use the local widget alpha value when drawing the widget. This flag is normally used by the internal GUIX logic to implement widget fading
animations.</p>
</li>
</ul>
</div>
<div class="paragraph">
<p><strong><strong><em>Text Alignment Styles (styles applied to all widgets that draw text):</em></strong></strong></p>
</div>
<div class="paragraph">
<p><strong>GX_STYLE_TEXT_LEFT</strong></p>
</div>
<div class="ulist">
<ul>
<li>
<p>Value: 0x00001000</p>
</li>
<li>
<p>Description: Text is drawn left-aligned within the widget client area.</p>
</li>
</ul>
</div>
<div class="paragraph">
<p><strong>GX_STYLE_TEXT_RIGHT</strong></p>
</div>
<div class="ulist">
<ul>
<li>
<p>Value: 0x00002000</p>
</li>
<li>
<p>Description: Text is drawn right-aligned within the widget client
area.</p>
</li>
</ul>
</div>
<div class="paragraph">
<p><strong>GX_STYLE_TEXT_CENTER</strong></p>
</div>
<div class="ulist">
<ul>
<li>
<p>Value: 0x00004000</p>
</li>
<li>
<p>Description: Text is drawn center-aligned within the widget client area.</p>
</li>
</ul>
</div>
<div class="paragraph">
<p><strong>GX_STYLE_TEXT_COPY</strong></p>
</div>
<div class="ulist">
<ul>
<li>
<p>Value: 0x00008000</p>
</li>
<li>
<p>Description: By default, widgets that draw text keep only a pointer to the text which is passed in by the application. For statically defined text that is defined within the string table, there is no reason for the widget to make a private copy of the text assigned. However, if the text assigned to a widget is created dynamically using functions like sprint() or gx_utility_ltoa, then it is often convenient to tell the widget to keep it&#8217;s own private copy of any text assigned. This allows the application to use automatic or temporary variables when defining the text string, when the application would otherwise be required to define statically defined character arrays for each text widget that is using dynamically defined text. When this style flag is set, the widget will use the gx_system_memory_allocator function to dynamically allocate the memory block needed to hold a private copy of the assigned string. Therefore using this style flag is predicated on the application defining memory_allocator and memory_deallocator functions. GX_STYLE_TEXT_COPY should not be cleared after it has been set, and doing so will cause unpredictable results.</p>
</li>
</ul>
</div>
<div class="paragraph">
<p><strong><strong><em>Button Styles (apply only to GUIX button widget types):</em></strong></strong></p>
</div>
<div class="paragraph">
<p><strong>GX_STYLE_BUTTON_PUSHED</strong></p>
</div>
<div class="ulist">
<ul>
<li>
<p>Value 0x00000010</p>
</li>
<li>
<p>Description: Indicates the button is in the pushed or selected state.</p>
</li>
</ul>
</div>
<div class="paragraph">
<p><strong>GX_STYLE_BUTTON_TOGGLE</strong></p>
</div>
<div class="ulist">
<ul>
<li>
<p>Value 0x00000020</p>
</li>
<li>
<p>Description: Button will switch status between pushed and unpushed on every click event. This style is commonly used with "checkbox" style buttons.</p>
</li>
</ul>
</div>
<div class="paragraph">
<p><strong>GX_STYLE_BUTTON_RADIO</strong></p>
</div>
<div class="ulist">
<ul>
<li>
<p>Value 0x00000040</p>
</li>
<li>
<p>Description: This style indicates the button will be exclusive, and deselect any button siblings when selected. This style is commonly used with "radio button" style buttons.</p>
</li>
</ul>
</div>
<div class="paragraph">
<p><strong>GX_STYLE_BUTTON_EVENT_ON_PUSH</strong></p>
</div>
<div class="ulist">
<ul>
<li>
<p>Value: 0x00000080</p>
</li>
<li>
<p>Description: Indicates the button generates a click event when initially pushed. The default operation is to generate a click event when the button is released.</p>
</li>
</ul>
</div>
<div class="paragraph">
<p><strong>GX_STYLE_BUTTON_REPEAT</strong></p>
</div>
<div class="ulist">
<ul>
<li>
<p>Value 0x00000100</p>
</li>
<li>
<p>Description: Indicates the button should send repeated click events to the button parent when the button is held in the pushed state.</p>
</li>
</ul>
</div>
<div class="paragraph">
<p><strong><strong><em>List Styles (apply only to GUIX list widget types):</em></strong></strong></p>
</div>
<div class="paragraph">
<p><strong>GX_STYLE_CENTER_SELECTED</strong></p>
</div>
<div class="ulist">
<ul>
<li>
<p>Value: 0x00000010</p>
</li>
<li>
<p>Description: Reserved</p>
</li>
</ul>
</div>
<div class="paragraph">
<p><strong>GX_STYLE_WRAP</strong></p>
</div>
<div class="ulist">
<ul>
<li>
<p>Value 0x00000020</p>
</li>
<li>
<p>Description: The list children wrap from start to end when the list is dragged or scrolled past the starting or ending list index.</p>
</li>
</ul>
</div>
<div class="paragraph">
<p><strong>GX_STYLE_FLICKABLE</strong></p>
</div>
<div class="ulist">
<ul>
<li>
<p>Value: 0x00000040</p>
</li>
<li>
<p>Description: Reserved</p>
</li>
</ul>
</div>
<div class="paragraph">
<p><strong><strong><em>Pixelmap Button and Icon Button Styles:</em></strong></strong></p>
</div>
<div class="paragraph">
<p><strong>GX_STYLE_HALIGN_CENTER</strong></p>
</div>
<div class="ulist">
<ul>
<li>
<p>Value: 0x00010000</p>
</li>
<li>
<p>Description: The button pixelmap should be center aligned within the button boundary on the horizontal axis.</p>
</li>
</ul>
</div>
<div class="paragraph">
<p><strong>GX_STYLE_HALIGN_LEFT</strong></p>
</div>
<div class="ulist">
<ul>
<li>
<p>Value: 0x00020000</p>
</li>
<li>
<p>Description: The button pixelmap should be left aligned within the button boundary on the horizontal axis.</p>
</li>
</ul>
</div>
<div class="paragraph">
<p><strong>GX_STYLE_HALIGN_RIGHT</strong></p>
</div>
<div class="ulist">
<ul>
<li>
<p>Value 0x00040000</p>
</li>
<li>
<p>Description: The button pixelmap should be right aligned within the button boundary on the horizontal axis.</p>
</li>
</ul>
</div>
<div class="paragraph">
<p><strong>GX_STYLE_VALIGN_CENTER</strong></p>
</div>
<div class="ulist">
<ul>
<li>
<p>Value 0x00080000</p>
</li>
<li>
<p>Description: The button pixelmap should be center aligned within the button boundary on the vertical axis.</p>
</li>
</ul>
</div>
<div class="paragraph">
<p><strong>GX_STYLE_VALIGN_TOP</strong></p>
</div>
<div class="ulist">
<ul>
<li>
<p>Value: 0x00100000</p>
</li>
<li>
<p>Description: The button pixelmap should be top aligned within the button boundary on the vertical axis.</p>
</li>
</ul>
</div>
<div class="paragraph">
<p><strong>GX_STYLE_VALIGN_BOTTOM</strong></p>
</div>
<div class="ulist">
<ul>
<li>
<p>Value: 0x00200000</p>
</li>
<li>
<p>Description: The button pixelmap should be bottom aligned within the button boundary on the vertical horizontal axis.</p>
</li>
</ul>
</div>
<div class="paragraph">
<p><strong><strong><em>Slider Styles (Apply only to GX_SLIDER and derived widget types):</em></strong></strong></p>
</div>
<div class="paragraph">
<p><strong>GX_STYLE_SHOW_NEEDLE</strong></p>
</div>
<div class="ulist">
<ul>
<li>
<p>Value: 0x00000200</p>
</li>
<li>
<p>Description: This style must be included for the slider to draw the needle indicator. This style can be disabled if the application wants to disable the slider needle or draw a custom needle indicator.</p>
</li>
</ul>
</div>
<div class="paragraph">
<p><strong>GX_STYLE_SHOW_TICKMARKS</strong></p>
</div>
<div class="ulist">
<ul>
<li>
<p>Value: 0x00000400</p>
</li>
<li>
<p>Description: The slider widget will do software drawing of dashed tickmark lines when this style is enabled.</p>
</li>
</ul>
</div>
<div class="paragraph">
<p><strong>GX_STYLE_SLIDER_VERTICAL</strong></p>
</div>
<div class="ulist">
<ul>
<li>
<p>Value 0x00000800</p>
</li>
<li>
<p>Description: Set this style flag to create a vertical slider, and clear this style flag to create a horizontal slider.</p>
</li>
</ul>
</div>
<div class="paragraph">
<p><strong><strong><em>Sprite Styles (Applies only to GX_SPRITE widget types):</em></strong></strong></p>
</div>
<div class="paragraph">
<p><strong>GX_STYLE_SPRITE_AUTO</strong></p>
</div>
<div class="ulist">
<ul>
<li>
<p>Value: 0x00000010</p>
</li>
<li>
<p>Description: Indicates the sprite animation will run automatically when the sprite widget received the GX_EVENT_SHOW event.</p>
</li>
</ul>
</div>
<div class="paragraph">
<p><strong>GX_STYLE_SPRITE_LOOP</strong></p>
</div>
<div class="ulist">
<ul>
<li>
<p>Value: 0x00000020</p>
</li>
<li>
<p>Description: With this style, the sprite widget will continuously loop through sprite animation frames until the sprite is stopped by the application.</p>
</li>
</ul>
</div>
<div class="paragraph">
<p><strong><strong><em>Pixelmap Slider Styles:</em></strong></strong></p>
</div>
<div class="paragraph">
<p><strong>GX_STYLE_TILE_BACKGROUND</strong></p>
</div>
<div class="ulist">
<ul>
<li>
<p>Value 0x00001000</p>
</li>
<li>
<p>Description: The slider background image is tiled to fill the sprite bounding rectangle. This allows a small vertical or horizontal stripe image to be used to fill the slider background.</p>
</li>
</ul>
</div>
<div class="paragraph">
<p><strong><strong><em>Additional Progress Bar Styles:</em></strong></strong></p>
</div>
<div class="paragraph">
<p><strong>GX_STYLE_PROGRESS_PERCENT</strong></p>
</div>
<div class="ulist">
<ul>
<li>
<p>Value: 0x00000010</p>
</li>
<li>
<p>Description: When this style is set, the progress bar will draw  bar value as a percentage rather than a raw value. The text is centered in the progress bar bounding rectangle.</p>
</li>
</ul>
</div>
<div class="paragraph">
<p><strong>GX_STYLE_PROGRESS_TEXT_DRAW</strong></p>
</div>
<div class="ulist">
<ul>
<li>
<p>Value: 0x00000020</p>
</li>
<li>
<p>Description: Draw the current progress bar value as decimal text centered within the progress bar.</p>
</li>
</ul>
</div>
<div class="paragraph">
<p><strong>GX_STYLE_PROGRESS_VERTICAL</strong></p>
</div>
<div class="ulist">
<ul>
<li>
<p>Value: 0x0000040</p>
</li>
<li>
<p>Description: Indicate the progress is vertically oriented. The default is horizontal orientation.</p>
</li>
</ul>
</div>
<div class="paragraph">
<p><strong>GX_STYLE_PROGRESS_SEGMENT_FILL</strong>:</p>
</div>
<div class="ulist">
<ul>
<li>
<p><strong>Value</strong>: 0x00000100</p>
</li>
<li>
<p>Description: The progress bar value is indicated with segmented filled rectangles, rather than a solid fill.</p>
</li>
</ul>
</div>
<div class="paragraph">
<p><strong><strong><em>Additional Radial Progress Bar Styles:</em></strong></strong></p>
</div>
<div class="paragraph">
<p><strong>GX_STYLE_RADIAL_PROGRESS_ALIAS</strong></p>
</div>
<div class="ulist">
<ul>
<li>
<p>Value: 0x00000200</p>
</li>
<li>
<p>Description: Draw the radial progress bar using anti-aliased brush styles. This requires more CPU bandwidth but also produces a nicer appearance. For lower performance CPU targets, clearing this style flag will result in faster drawing speed.</p>
</li>
</ul>
</div>
<div class="paragraph">
<p><strong>GX_STYLE_RADIAL_PROGRESS_ROUND</strong></p>
</div>
<div class="ulist">
<ul>
<li>
<p>Value: 0x00000400</p>
</li>
<li>
<p>Description: Use a round line end brush style when drawing the radial progress bar arc. The default is a square line end.</p>
</li>
</ul>
</div>
<div class="paragraph">
<p><strong><strong><em>Additional Text Input Styles:</em></strong></strong></p>
</div>
<div class="paragraph">
<p><strong>GX_STYLE_ CURSOR_BLINK</strong></p>
</div>
<div class="ulist">
<ul>
<li>
<p>Value: 0x00000040</p>
</li>
<li>
<p>Description: The text input widget cursor will flash on and off rather than being steady.</p>
</li>
</ul>
</div>
<div class="paragraph">
<p><strong>GX_STYLE_ CURSOR_ALWAYS</strong></p>
</div>
<div class="ulist">
<ul>
<li>
<p>Value: 0x00000080</p>
</li>
<li>
<p>Description. The text input widget cursor is normally only displayed when the widget owns input focus. This style flag will make the cursor always visible regardless of input focus.</p>
</li>
</ul>
</div>
<div class="paragraph">
<p><strong>GX_STYLE_TEXT_INPUT_NOTIFY_ALL</strong></p>
</div>
<div class="ulist">
<ul>
<li>
<p>Value: 0x00000100</p>
</li>
<li>
<p>Description: With this style flag set the GX_EVENT_TEXT_EDITED event every time key down event is received by the text input widget.</p>
</li>
</ul>
</div>
<div class="paragraph">
<p><strong><strong><em>Additional Window Styles:</em></strong></strong></p>
</div>
<div class="paragraph">
<p><strong>GX_STYLE_TILE_WALLPAPER</strong></p>
</div>
<div class="ulist">
<ul>
<li>
<p>Value: 0x00040000</p>
</li>
<li>
<p>Description: The window will tile any assigned wallpaper image to fill the window client rectangle.</p>
</li>
</ul>
</div>
<div class="paragraph">
<p><strong>GX_STYLE_AUTO_HSCROLL</strong></p>
</div>
<div class="ulist">
<ul>
<li>
<p>Value: 0x00100000</p>
</li>
<li>
<p>Description: Reserved for future use.</p>
</li>
</ul>
</div>
<div class="paragraph">
<p><strong>GX_STYLE_AUTO_VSCROLL</strong></p>
</div>
<div class="ulist">
<ul>
<li>
<p>Value: 0x00200000</p>
</li>
<li>
<p>Description: Reserved for future use.</p>
</li>
</ul>
</div>
<div class="paragraph">
<p><strong><strong><em>Additional Menu Styles:</em></strong></strong></p>
</div>
<div class="paragraph">
<p><strong>GX_STYLE_MENU_EXPANDED</strong></p>
</div>
<div class="ulist">
<ul>
<li>
<p>Value: 0x00000010</p>
</li>
<li>
<p>Description: Accordion menu widget is initially in expanded state.</p>
</li>
</ul>
</div>
<div class="paragraph">
<p><strong><strong><em>Additional Tree View Styles:</em></strong></strong></p>
</div>
<div class="paragraph">
<p><strong>GX_STYLE_TREE_VIEW_SHOW_ROOT_LINES</strong></p>
</div>
<div class="ulist">
<ul>
<li>
<p>Value: 0x00000010</p>
</li>
<li>
<p>Description: Tree view widget should draw lines from node icon to root tree node.</p>
</li>
</ul>
</div>
<div class="paragraph">
<p><strong><strong><em>Additional Scrollbar Styles:</em></strong></strong></p>
</div>
<div class="paragraph">
<p><strong>GX_SCROLLBAR_BACKGROUND_TILE</strong></p>
</div>
<div class="ulist">
<ul>
<li>
<p>Value: 0x00010000</p>
</li>
<li>
<p>Description: Reserved for future use.</p>
</li>
</ul>
</div>
<div class="paragraph">
<p><strong>GX_SCROLLBAR_RELATIVE_THUMB</strong></p>
</div>
<div class="ulist">
<ul>
<li>
<p>Value: 0x00020000</p>
</li>
<li>
<p>Description: The scrollbar thumb width (for a horizontal scroll bar) or height (for a vertical scroll bar) are calculated based on the ratio of the visible area of the parent window to the min and max scrollbar range.</p>
</li>
</ul>
</div>
<div class="paragraph">
<p><strong>GX_SCROLLBAR_END_BUTTONS</strong></p>
</div>
<div class="ulist">
<ul>
<li>
<p>Value: 0x00040000</p>
</li>
<li>
<p>Description: The scrollbar automatically creates and attaches buttons at each end of the scrollbar region.</p>
</li>
</ul>
</div>
<div class="paragraph">
<p><strong>GX_SCROLLBAR_VERTICAL</strong></p>
</div>
<div class="ulist">
<ul>
<li>
<p>Value: 0x01000000</p>
</li>
<li>
<p>Description: The scrollbar is vertically oriented.</p>
</li>
</ul>
</div>
<div class="paragraph">
<p><strong>GX_SCROLLBAR_HORIZONTAL</strong></p>
</div>
<div class="ulist">
<ul>
<li>
<p>Value: 0x02000000</p>
</li>
<li>
<p>Description: The scrollbar is horizontally oriented.</p>
</li>
</ul>
</div>
<div class="paragraph">
<p><strong><strong><em>Text Scroll Wheel Styles:</em></strong></strong></p>
</div>
<div class="paragraph">
<p><strong>GX_STYLE_TEXT_SCROLL_WHEEL_ROUND</strong></p>
</div>
<div class="ulist">
<ul>
<li>
<p>Value: 0x00000200</p>
</li>
<li>
<p>Description: The scroll wheel uses a Sinusoidal algorithm to make the scroll wheel appear to have a rounded shape. This style flag can add significant overhead to the performance of the scroll wheel widget, but can also give the wheel a 3D realistic appearance.</p>
</li>
</ul>
</div>
</div>
<div id="footer">
<div id="footer-text">
Last updated 2025-02-07 08:25:21 UTC
</div>
</div>
</body>
</html>